<template>
  <div id="editor1"></div>
</template>

<script>
import E from "wangeditor";
import {getListById } from "../api/article"
export default {
  props: ["onchangeContent",'id','onchangeLst'],
   data(){
    return{
      editor:null
    }
  },
  mounted() {
    console.log(this.content,'content')
    this.editor = new E("#editor1");   
    // 内容改变时触发
    this.editor.config.onchange = () =>{
      this.onchangeContent(this.editor.txt.html());
    };
    this.editor.create();
  },
  methods:{   
    // 清空
    clearContent(){
      this.editor.txt.clear()
    },
     async edit() {
       if(this.id){
         let {data} = await getListById(this.id)
          this.onchangeLst(data)
         this.editor.txt.html(data.content)
       }     
    },
  },
    watch:{
      id:{
        handler(){
        this.edit()
        },
        deep:true,
        immediate:true
      }
  },
};
</script>

<style scoped></style>
